<!DOCTYPE HTML>
<html manifest="manifest.file">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="viewport" id="view" content="width=device-width,minimum-scale=1, maximum-scale=1;"> 
	<meta name="apple-mobile-web-app-capable" content="yes" />
    <link rel="apple-touch-icon" href="icon.png"/>

	<link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.0.min.css" />
	<script type="text/javascript" charset="utf-8" src="jquery.mobile/jquery-1.6.4.min"></script>
	<script type="text/javascript" charset="utf-8" src="jquery.mobile/jquery.mobile-1.0.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="jquery.tweetable.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
	
	<style>
		.ui-li-aside{width:20%;} 
	</style>
	<script type="text/javascript" charset="utf-8">
		
		today  = new Date();
		todayEpoch  = today.getTime();

		target = new Date("08 July, 2012"); 
		targetEpoch = target.getTime();

		daysLeft = Math.floor(((targetEpoch - todayEpoch) / (60*60*24)) / 1000);
      
        var onDeviceReady = function() {
            $('#tweets').tweetable({username: 'UUOMDSI'});
        };

        function init() {
            document.addEventListener("deviceready", onDeviceReady, true);
        }   
	</script>  

  </head>
  <body onload="init()">
	
	<section data-role="page" id="home" data-theme="e">
		<header data-role="header">
			<h1>OMDSI 2012 Schedule</h1>
		</header>		
		<article data-role="content">	
			<ul data-role="listview" data-inset="true" data-filter="false">
				<li data-role="list-divider">Schedules</li>
				<li><a href="#adult">Adults</a></li>
				<li><a href="#yadult">Young Adults</a></li>
				<li><a href="#youth">Youth</a></li>
				<li data-role="list-divider"></li>
				<!-- li><a href="#early">Early Afternoon 1:30-3:00</a><span class="ui-li-count">9</span></li>
				<li><a href="#late">Late Afternoon 3:15 - 4:45</a><span class="ui-li-count">11</span></li>
				<li><a href="#evening">Evening</a></li-->
				<li><a href="#announce">Announcements</a></li>
				<li><a href="kenyon.jpg" rel="external">Map</a></li>
				<li style="padding:.7em 15px .7em 15px"><script>document.write(daysLeft);</script> Days until SI 2012!</li>
			</ul>
			<p>Do you find this app useful? Consider making a donation to the scholarship fund. (You can do that if you don't find it useful, too)</p>
		</article>	
	</section>
	
	<section data-role="page" id="adult" data-theme="e">
		<header data-role="header">
			<h1>Adult Schedule</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>		
		<article data-role="content">	
			<ul data-role="listview" data-inset="true" data-filter="false">
				<li>
					<h3 class="ui-li-heading">Breakfast</h3>
					<p class="ui-li-aside ui-li-desc"><strong>7:00-<br/>8:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Morning Worship</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Theme Speaker</h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>10:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#morning">Morning Workshops</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>10:30-<br/>11:45</strong></p>
					<!--span class="ui-li-count">18</span-->
				</li>
				<li>
					<h3 class="ui-li-heading">Lunch</h3>
					<p class="ui-li-aside ui-li-desc"><strong>12:00<br/>-1:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#early">Early Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>1:30-<br/>3:00</strong></p>
					<!-- span class="ui-li-count">9</span-->
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>3:15-<br/>4:45</strong></p>
					<!-- span class="ui-li-count">11</span-->
				</li>
				<li>
					<h3 class="ui-li-heading">Dinner</h3>
					<p class="ui-li-aside ui-li-desc"><strong>5:00-<br/>6:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#evening">Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>6:30-<br/>8:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Vespers</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>12:00</strong></p>
				</li>
			</ul>
		</article>	
	</section>
	<section data-role="page" id="yadult" data-theme="e">
		<header data-role="header">
			<h1>Young Adult Schedule</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>		
		<article data-role="content">
			<p>Note: this is still incomplete and maybe inaccurate</p>
			<ul data-role="listview" data-inset="true" data-filter="false">
				<li>
					<h3 class="ui-li-heading">Breakfast</h3>
					<p class="ui-li-aside ui-li-desc"><strong>7:00-<br/>8:30</strong></p>
				</li>
				<!-- li>
					<h3 class="ui-li-heading">Morning Worship</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Theme Speaker</h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>10:15</strong></p>
				</li-->
				<li>
					<h3 class="ui-li-heading"><a href="#morning">Morning Workshops</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>10:30-<br/>11:45</strong></p>
					<!--span class="ui-li-count">18</span-->
				</li>
				<li>
					<h3 class="ui-li-heading">Lunch</h3>
					<p class="ui-li-aside ui-li-desc"><strong>12:00<br/>-1:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#early">Early Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>1:30-<br/>3:00</strong></p>
					<!-- span class="ui-li-count">9</span-->
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>3:15-<br/>4:45</strong></p>
					<!-- span class="ui-li-count">11</span-->
				</li>
				<li>
					<h3 class="ui-li-heading">Dinner</h3>
					<p class="ui-li-aside ui-li-desc"><strong>5:00-<br/>6:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#evening">Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>6:30-<br/>8:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Vespers</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>12:00</strong></p>
				</li>
			</ul>
		</article>	
	</section>
	<section data-role="page" id="youth" data-theme="e">
		<header data-role="header">
			<h1>Youth Schedule</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>		
		<article data-role="content">	
			<p>Note: this is still incomplete and maybe inaccurate</p>
			<ul data-role="listview" data-inset="true" data-filter="false">
				<li>
					<h3 class="ui-li-heading">Breakfast</h3>
					<p class="ui-li-aside ui-li-desc"><strong>7:00-<br/>8:30</strong></p>
				</li>
				<!-- li>
					<h3 class="ui-li-heading">Morning Worship</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Theme Speaker</h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>10:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#morning">Morning Workshops</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>10:30-<br/>11:45</strong></p>
					<!--span class="ui-li-count">18</span-->
				</li-->
				<li>
					<h3 class="ui-li-heading">Lunch</h3>
					<p class="ui-li-aside ui-li-desc"><strong>12:30<br/>-1:30</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#early">Early Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>1:30-<br/>3:00</strong></p>
					<!-- span class="ui-li-count">9</span-->
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Afternoon</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>3:15-<br/>4:45</strong></p>
					<!-- span class="ui-li-count">11</span-->
				</li>
				<li>
					<h3 class="ui-li-heading">Dinner</h3>
					<p class="ui-li-aside ui-li-desc"><strong>5:00-<br/>6:30</strong></p>
				</li>
				<!-- li>
					<h3 class="ui-li-heading"><a href="#evening">Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>6:30-<br/>8:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading">Vespers</h3>
					<p class="ui-li-aside ui-li-desc"><strong>8:30-<br/>9:15</strong></p>
				</li>
				<li>
					<h3 class="ui-li-heading"><a href="#late">Late Evening</a></h3>
					<p class="ui-li-aside ui-li-desc"><strong>9:30-<br/>12:00</strong></p>
				</li-->
			</ul>
		</article>	
	</section>
	
	<section data-role="page" id="announce" data-theme="e">
		<header data-role="header">
			<h1>Announcements</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			<p>We will be streaming our morning announcements via Twitter this year.</p>
			<p>Please follow <a href="http://twitter.com/#/UUOMDSI" rel="external">@UUOMDSI</a> if you want get 
			announcements even if you don't make it to Rosse Hall to hear them. </p>
			<div id="tweets"></div>
		</article>
	</section>
	
	<section data-role="page" id="map" data-theme="e">
		<header data-role="header">
			<h1>Kenyon map</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			<img src="kenyon.jpg"/>
		</article>
	</section>
	
	<section data-role="page" id="morning" data-theme="e">
		<header data-role="header">
			<h1>Morning workshops</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			This will be updated when the schedule is finalized
		</article>
	</section>
	<section data-role="page" id="early" data-theme="e">
		<header data-role="header">
			<h1>Early Afternoon 1:30-3:00</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			This will be updated when the schedule is finalized
		</article>
	</section>
	<section data-role="page" id="late" data-theme="e">
		<header data-role="header">
			<h1>Late Afternoon 3:15 - 4:45</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			This will be updated when the schedule is finalized
		</article>
	</section>
	<section data-role="page" id="evening" data-theme="e">
		<header data-role="header">
			<h1>Evening</h1>
			<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
		</header>	
		<article data-role="content">	
			This will be updated when the schedule is finalized
		</article>
	</section>
  </body>
</html>
